﻿<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<title>css3鼠标悬停九宫格相册图片方格变圆形动画特效</title>

<link rel="stylesheet" href="css/style.css">

</head>
<body>

<div class="grid">
  <div class="grid__item">
    <img src="img/1.png" alt="Avatar for user 1">
  </div>

  <div class="grid__item">
    <img src="img/2.jpg" alt="Pug">
  </div>

  <div class="grid__item">
    <img src="img/3.png" alt="Pug">
  </div>

  <div class="grid__item">
    <img src="img/2.jpg" alt="Pug">
  </div>

  <div class="grid__item">
    <img src="img/6.png" alt="Pug">
  </div>

  <div class="grid__item">
    <img src="img/7.jpg" alt="Pug">
  </div>

  <div class="grid__item">
    <img src="img/8.png" alt="Pug">
  </div>

  <div class="grid__item">
    <img src="img/3.png" alt="Pug">
  </div>

  <div class="grid__item">
    <img src="img/10.svg" alt="Pug">
  </div>
</div>

<!--svg 格式图片处理-->
<script src='js/jquery.min.js'></script>
<script src="js/script.js"></script>

</body>
</html>